<?php

use yii\helpers\Html;

use yii\widgets\ActiveForm;
?>
<center><h1>地区管理</h1></center>
新增<span id='ji'>1</span>级地区：<input type="text" name="area" id='area'>
<input type="hidden" value="1" id="hid">
<input type="hidden" value="0" id="pid">
<button class="btn btn-primary" id="button">确定</button>
<hr/>
<ul class="p">
	<?php foreach($areas as $key => $val):?>
		<li>
			<?=$val['area_name']?>
			　<a href="javascript:;" pid='<?=$val['area_id']?>' class="ed">管理</a>
		</li>
	<?php endforeach;?>
</ul>

<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
	$('#button').click(function(){
		var area  = $('#area').val();
		var level = $('#hid').val();
		var pid   = $('#pid').val();
		$.ajax({
			type:'get',
			url:'index.php?r=area/adds',
			data:{area:area,level:level,pid:pid},
			// dataType:'json',
			success:function(data){
				if(data != 0){
					$('ul').append('<li>'+area+'　<a href="javascript:;" pid="'+data+'" class="ed">管理</a></li>');
				}
			}
		});
	});
	$(document).on('click','.ed',function(){
		var pid = $(this).attr('pid');
		$('#pid').val(pid);
		var hid = $('#hid').val();
		var level = 1 + (hid)*1;
		$('#hid').val(level);
		$('#ji').html(level);
		var str = '';
		$.ajax({
			type:'get',
			url:'?r=area/select',
			data:{
				pid:pid
			},
			dataType:'json',
			success:function(data){
				str+='<ul class="p">';
				$(data).each(function(k,v){
					str+='<li>'+v.area_name+'</li>';
				})
				str+='</ul>';
				$('.p').html(str);
			}
		});
	})
</script>